<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ include file="/WEB-INF/jsp/include.jsp"%>



<script>
 	function deleteFunction(frm){
 		var isDel = confirm("Bạn có muốn xóa sản phẩm này?");
 		if (isDel) {
 			return true;
 		} else {
 			return false;
 		}
 	}
</script>
<div id="content-block">

	<div id="breadcrumb">
		<div class="breadcrumb">
			<a href="home.html">Trang chủ</a> »
		</div>
	</div>

	<div id="page-title">
	Giỏ Hàng</div>
<div class="view view-uc-products-frontpage view-id-uc_products_frontpage view-display-id-block_1 view-dom-id-11">
				<div class="view-content">	
				<p>Tên người mua: ${user.name}</p></br>
				<p>Số điện thoại: ${user.phonenumber}</p></br>
					<table class="spchonmua" style="width: 565px; float: left; border: 1px double #E4E4E4; height: 150px;">
	<tbody>
		<tr>
			<td align="center" style="width: 5%; border: 1px double #E4E4E4" class="cssTitle"><a
				class="text_vangto">STT</a></td>
			<td align="center" style=" border: 1px double #E4E4E4" class="cssTitle" colspan="2"><a
				class="text_vangto">Tên sản phẩm </a></td>
			<td align="center" width="17%" style=" border: 1px double #E4E4E4" class="cssTitle"><a
				class="text_vangto">Số lượng</a></td>
			<td align="center" width="20%" style=" border: 1px double #E4E4E4" class="cssTitle"><a
				class="text_vangto">Đơn giá (VND) </a></td>
			<td align="center" width="10%" style=" border: 1px double #E4E4E4" class="cssTitle"><a
				class="text_vangto">Đơn vị</a></td>
			<td align="center" width="16%" style=" border: 1px double #E4E4E4" class="cssTitle"><a
				class="text_vangto">Tổng giá (VND) </a></td>
			<td align="center" width="5%" style=" border: 1px double #E4E4E4" class="cssTitle" colspan="2"><a
				class="text_vangto">Xóa </a></td>
		</tr>
		<c:set var="stt" value="0"/>
		<c:forEach var="detail" items="${booking}">
		<tr style="background-color: white;">
			<td align="center" style=" border: 1px double #E4E4E4" ><a class="text_tin"><c:out value="${stt+1}"/></a></td>
			<td align="center" colspan="2" style=" border: 1px double #E4E4E4"><a class="text_tin"
				href=""
				title=""> ${detail.productName}</a></td>
			<td align="center" style=" border: 1px double #E4E4E4"><a class="text_tin"><input type="number"
					class="quantity" name="${detail.productCode}" size="6" id="quantity-id" value="${detail.quantity}" min="1" max="${detail.maxQuantity}"></a></td>
			<td align="right" style=" border: 1px double #E4E4E4"><a class="text_tin" name = "uc_price_name">${detail.unitPrice}</a></td>
			<td align="right" style=" border: 1px double #E4E4E4"><a class="text_tin">${detail.unit}</a></td>
			<td align="right" style=" border: 1px double #E4E4E4"><a class="text_tin" name = "uc_price_name">${detail.price}</a></td>
			<td align="center" colspan="2" style=" border: 1px double #E4E4E4"><a
				href="/moveproductbooking.html?id=${detail.productCode}">-</a></td>
		</tr>
		<c:set var="stt" value="${stt+1}"/>
		</c:forEach>
			</tbody>
</table>
<table>
<tbody>
		<tr>
			<td
				style="border-right: medium none; border-bottom: medium none; width:80%; text-align: right;"
				colspan="6">Tổng tiền hàng:</td>
			<td
				style="border-right: medium none; border-bottom: medium none; text-align: right;"
				colspan="2"><span style="padding-left: 5px;"
				id="estore-product-amount" name = "uc_price_name">${order.basePrice}</span>&nbsp;VND</td>
			<td style="border-bottom: medium none;">&nbsp;</td>
		</tr>
		<tr>
			<td
				style="border-right: medium none; border-bottom: medium none; text-align: right;"
				colspan="6">Phí vận chuyển:</td>
			<td
				style="border-right: medium none; border-bottom: medium none; text-align: right;"
				colspan="2"><span style="padding-left: 5px;"
				id="estore-shipping-fee7" name = "uc_price_name">10000</span> VND</td>
			<td style="border-bottom: medium none;">&nbsp;</td>
		</tr>
		<tr>
			<td
				style="border-right: medium none; border-bottom: medium none; text-align: right;"
				colspan="6">Tổng tiền:</td>
			<td
				style="border-right: medium none; border-bottom: medium none; text-align: right;"
				colspan="2"><a class="text_bigdart"><span
					style="padding-left: 5px;" id="estore-total-amount7" name = "uc_price_name">${order.totalPrice}</span> VND</a></td>
			<td style="border-bottom: medium none;">&nbsp;</td>
		</tr>
	</tbody>
</table>
<script type="text/javascript">
$(function() {
	$('.quantity').change(function() {
    	var quantity = $(this).val();
    	var productCode = $(this).attr('name');
    	var maxQuantity = $(this).attr('max');
    	if(parseInt(quantity) <= parseInt(maxQuantity)){
    		$.post("/editquantity.html", { code: productCode, quantity: quantity})
    		.done(function(data) { 
    			var content = $('<div />').html(data).find('#content-block').html(); 
				var rightOrderBlock = $('<div />').html(data).find('#right-order-block-id').html(); 
				if(content != null){
				  $('#center-column').empty().append(content);
				  $('#right-order-block-id').empty().append(rightOrderBlock); 
			   } 
			   else{
				   alert("Số lượng không thay đổi được. Vui lòng liên hệ nhà quản trị!");
			   }
    		});
    	}else{
    		alert("Số lượng sản phẩm phải nhỏ hơn hoặc bằng " + maxQuantity);
    		
    	}
    });
	
    $('#dialog-confirm').dialog({
    	 autoOpen: false,
    	 resizable: false,
         modal: true,
         buttons: {
           "Xác nhận": function() {
             $( this ).dialog( "close" );
             $.post("/saveorder.html",function(data,status){
            	 var content = $('<div />').html(data).find('#shopping-done-id').html(); 
            	 $('#center-column').empty().append(content);
             });
           },
           "Hủy bỏ": function() {
             $( this ).dialog( "close" );
           }
         }
    });
    });
    
$('#booking-submit-id').on('click', function(e) {
    $('#dialog-confirm').dialog('open');
});
</script>
<p style="margin-top:10px;"><strong>THÔNG TIN KHÁCH HÀNG (Quý khách điền thông tin vào bảng sau): </strong></p>
<%-- <form:form action="" method="post" enctype="multipart/form-data" accept-charset="UTF-8" commandName="user"> --%>

Họ và tên khách hàng
<input id="reciever-name-id" name="name" style="margin-left:7px;" value="${user.name}"/>
</br>
<%-- 			<form:input path="name"/> --%>

<strong>Địa chỉ giao hàng</strong>
</br>

Số
<input id="delivery-no-id" name="" style="margin-left:113px;" value="${user.deliveryNo}"/>
<%-- 			<form:input path=""/> --%>
Tên đường
<input id="delivery-street-id" name="" style="margin-left:33px;" value="${user.deliveryStreet}"/>
<%-- 			<form:input path=""/> --%>
</br>
Xã/Phường
<input id="delivery-ward-id" name="" style="margin-left:66px;" value="${user.deliveryWard}"/>
<%-- 			<form:input path=""/> --%>
Huyện/NhaTrang
<input id="delivery-district-id" name=""value="${user.deliveryDistrict}"/>
<!-- 		<button id="booking"style="background:#af0102; width: 100x; border: none; margin-top:15px;"> -->
<!-- 				<p style="font:15px bold Georgia,serif; color:#c96d15; margin:auto"> -->
<!-- 					THAY ĐỔI THÔNG TIN -->
<!-- 				</p> -->
<!-- 		</button> -->
		</br>
Số điện thoại
<input id="delivery-phone-id" name="" style="margin-left:55px;" value="${user.phonenumber}"/>
</br>
Thời gian giao hàng
<input id="delivery-time-id" name="" style="margin-left:20px;"/>
</br>
Ghi chú thêm
<input id="delivery-note-id" name="" style="margin-left:53px;"/>
<%-- 		<form:input path=""/> --%>
<%-- </form:form> --%>
</div>
</div>
<input type="button" id="booking-submit-id" name="dathang" value="Đặt Hàng" />
<div id="dialog-confirm" title="Xác nhận">
<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>Đơn hàng của bạn là <strong>${order.code}</strong> . Xin vui lòng xác nhận.</p>
</div>
<script type="text/javascript" src="./js/listProduct.js"></script>
</div>
	




